<script lang="ts" setup>
import { safeAreaInsets } from '@/utils/systemInfo'

definePage({
  style: {
    navigationStyle: 'custom',
    navigationBarTitleText: 'Banner',
  },
})
const title = ref<string>('')
const attachList = ref('')
const isShow = ref(false)
onLoad((options: any) => {
  title.value = options.title
  attachList.value = JSON.parse(decodeURIComponent(options.attachments))
})
function back() {
  uni.navigateBack()
}
// 监听滑动事件
onPageScroll((event: any) => {
  isShow.value = event.scrollTop >= 100
})
</script>

<template>
  <view :style="{ paddingBottom: `${safeAreaInsets.bottom}px` }">
    <wd-icon v-if="!isShow" :custom-style="`top: ${safeAreaInsets.top}px`" custom-class="absolute top-[20rpx] left-[20rpx] z-10" name="arrow-left" size="50rpx" @click="back" />
    <wd-navbar v-if="isShow" safe-area-inset-top left-arrow fixed :bordered="false" :title="title" @click-left="back" />
    <poster v-model="attachList" />
  </view>
</template>
